import { memo } from 'react'
import TableContent from '@/components/CRUD-Cpns/TableContent'
import { useMainStore } from '@/store/main'
import { Button, Space } from 'antd'
import { RouterRes } from '@/service/login/types'
import type { TableColumns } from '@/components/CRUD-Cpns/TableContent/type'

const config: TableColumns<RouterRes> = [
	{ title: '批次名称', key: 'name', dataIndex: ['meta', 'title'], align: 'center', width: 200 },
	{ title: '操作', key: 'handler', align: 'center' }
]

const Menu = memo(() => {
	const { userMenus } = useMainStore()

	return (
		<TableContent
			index={false}
			rowKey="path"
			tableName="表格"
			toolbars={
				<Space>
					<Button type="primary">新建</Button>
				</Space>
			}
			columns={config}
			dataSource={userMenus}
			pagination={{
				current: 1,
				pageSize: 10
			}}
			renders={{
				name: (value) => <span>{value}</span>,
				handler: () => (
					<Button type="primary" size="small">
						操作
					</Button>
				)
			}}
		/>
	)
})

export default Menu
